<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>跟踪信息页面</title>
		<link rel="stylesheet" href="layui/css/layui.css" media="all">

		<style>
			.layui-btn:not(.layui-btn-lg):not(.layui-btn-sm):not(.layui-btn-xs) {
				height: 34px;
				line-height: 34px;
				padding: 0 8px;
			}
		</style>
	</head>
	<body>
		<div class="layuimini-container">
			<div class="layuimini-main">
				<div class="layui-form" style="margin-top: 20px;" onsubmit="false">
					<div class="layui-form-item">
						<label class="layui-form-label">咨询师姓名:</label>
						<div class="layui-input-inline">
							<input type="text" name="username" id="username" placeholder="请输入咨询师姓名" class="layui-input">
						</div>
						<label class="layui-form-label">学生姓名:</label>
						<div class="layui-input-inline">
							<input type="text" name="stuname" id="stuname" placeholder="请输入学生姓名" class="layui-input">
						</div>
						<div  id="trackdate">
						<label class="layui-form-label" style="width: 130px;">跟踪开始与结束时间:</label>
						<div class="layui-input-inline" style="width: 150px;">
							<input type="text" id="trackdatebegin" name="trackdatebegin" placeholder="请输入开始时间" class="layui-input">
						</div>
						<div class="layui-form-mid">-</div>
						<div class="layui-input-inline" style="width: 150px;">
							<input type="text" id="trackdateend" name="trackdateend" placeholder="请输入结束时间" class="layui-input">
						</div>
                   </div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">跟踪类型:</label>
						<div class="layui-input-inline">
						<select name="tracktype" id="tracktype"  lay-search>
									<option value=""></option>
									<option value="电话">电话</option>
								    <option value="EMAIL">EMAIL</option>
								    <option value="短信">短信</option>
								    <option value="当面">当面</option>
								</select>
						</div>
						<label class="layui-form-label">回访情况:</label>
						<div class="layui-input-inline" style="width: 120;">
							<select name="IsReturnVisit" id="IsReturnVisit" class="layui-input">
								<option value="">请选择回访情况</option>
								<option value="1">已回访</option>
								<option value="2">未回访</option>
							</select>
						</div>
						<label class="layui-form-label">跟踪状态:</label>
						<div class="layui-input-inline" style="width: 120;">
							<select name="trackstate" id="trackstate" class="layui-input">
								<option value="">请选择状态</option>
								<option value="1">已完成</option>
								<option value="2">跟进中</option>
								<option value="3">未完成</option>
							</select>
						</div>
						<button class="layui-btn" id="search" data-type="reload" type="button">搜索</button>
					</div>
				</div>
			</div>
			<div>
				<table class="layui-hide" id="test" lay-filter="test"></table>
			</div>
		</div>



		<!-- 操作列 -->
		<script type="text/html" id="barDemo">
			<a class="layui-btn layui-btn-xs" lay-event="detailstrack">详情</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="deltrack">删除</a>
		</script>
		<script type="text/html" id="toolbarDemo">
			<!--表头上面引入了一个添加跟踪的操作-->
		<div class="layui-btn-container">
			<!--<button class="layui-btn layui-btn-sm" lay-event="addtrack">添加</button>-->
		</div>
		</script>
		<script src="layui/layui.js" charset="utf-8"></script>
		<script src="js/Global.js" type="text/javascript" charset="utf-8"></script>

		<script type="text/html" id="trackstategenzongzhuangtai">
		    {{# if(d.trackstate == 1){ }}
		<span style="color: #F581B1;">已完成</span>
			{{# }else if(d.trackstate == 2){ }}
		<span style="color: #1e9fff;">跟进中</span>
			{{# }else if(d.trackstate == 3){ }}
		<span style="color: #b284be;">未完成</span>
			{{# } }}
		</script>
		
		<script type="text/html" id="IsReturnVisithuifang">
		    {{# if(d.IsReturnVisit == 1){ }}
		<span style="color: #F581B1;">已回访</span>
			{{# } else if(d.IsReturnVisit == 2){ }}
		<span style="color: #1e9fff;">未回访</span>
			{{# } }}
		</script>
		
		<script>
		layui.use([ 'form', 'table', 'laydate' ],
				function() { //如果只加载一个模块，可以不填数组。如：layui.use('form')
					form = layui.form, table = layui.table;//获取table模块
					var laydate = layui.laydate;
					var $ = layui.jquery;
					//执行一个laydate实例
					laydate.render({
						elem : '#trackdate', //指定元素
						type : 'datetime',
						theme: 'molv',
						trigger : 'click', //采用click弹出
						calendar : true, //允许显示公历节日
						range : [ '#trackdatebegin', '#trackdateend' ]
					});
					// 渲染表格
						table
							.render({
								elem: '#test',
								url: globalData.server +
									'public/getAllTrack',
								toolbar: '#toolbarDemo', //开启头部工具栏
								where: {
									method: 'getAll',
									trackname: ''
								},
								method: 'POST',
								defaultToolbar: ['filter', 'exports', 'print', {
					                title: '提示',
					                layEvent: 'LAYTABLE_TIPS',
					                icon: 'layui-icon-tips'
					            }],
								cols: [
									[{
											field: 'trackid',
											title: '跟踪ID',
											fixed: 'left',
											align: 'center',
											sort: true,
											width: 100,
										},
										{
											field: 'username',
											title: '咨询师跟踪者',
											align: 'center',
											width: 130,
										},
										{
											field: 'stuname',
											title: '跟踪学生姓名',
											align: 'center',
											width: 130,
										},{
											field: 'trackcreatetime',
											title: '跟踪创建日期',
											templet: "<div>{{layui.util.toDateString(d.trackcreatetime, 'yyyy-MM-dd HH:mm:ss')}}</div>",
											align: 'center',
											width: 160,
										},
										{
											field: 'trackdatebegin',
											title: '跟踪开始日期',
											templet: "<div>{{layui.util.toDateString(d.trackdatebegin, 'yyyy-MM-dd HH:mm:ss')}}</div>",
											align: 'center',
											width: 160,
										},
										{
											field: 'trackdateend',
											title: '跟踪结束日期',
											templet: "<div>{{layui.util.toDateString(d.trackdateend, 'yyyy-MM-dd HH:mm:ss')}}</div>",
											align: 'center',
											width: 160,
										},
										{
											field: 'tracktype',
											title: '跟踪类型',
											align: 'center',
											width: 100,
										},
										{
											field: 'trackstate',
											title: '跟踪状态',
											templet: '#trackstategenzongzhuangtai',
											align: 'center',
											width: 100,
										}, {
											field: 'trackcontent',
											title: '跟踪内容',
											align: 'center',
											width: 120,
										},{
											field: 'IsReturnVisit',
											title: '回访情况',
											templet: '#IsReturnVisithuifang',
											align: 'center',
											width: 100,
										}, {
											title: '操作',
											fixed: 'right',
											align: 'center',
											toolbar: '#barDemo',
											width: 150
										}
									]
								],
								id: 'testReload',
								page: true
							});

						$('#search').on('click', function() {
							var username = $("#username").val();
							var stuname = $("#stuname").val();
							var trackdatebegin = $("#trackdatebegin").val();
							var trackdateend = $("#trackdateend").val();
							var trackstate = $("#trackstate").val();
							var tracktype = $("#tracktype").val();
							var IsReturnVisit = $("#IsReturnVisit").val();
							table.reload('testReload', {
								where: {
									'username': username,
									'stuname': stuname,
									'trackdatebegin': trackdatebegin,
									'trackdateend': trackdateend,
									'trackstate': trackstate,
									'tracktype': tracktype,
									'IsReturnVisit':IsReturnVisit
								}
							});
						});
						//监听提交按钮
						table
							.on(
								'tool(test)',function(obj) {
									var data = obj.data;
									if (obj.event === 'deltrack') {
										layer.confirm('真的删除该跟踪信息吗?',function(index) {
											console.log(obj.data);
													var url = globalData.server +'public/deleteTrack';
													$.post(url, {
																"trackid": obj.data.trackid,
																method: 'delete'
															},
															function(data) {
																if (data.count > 0) {
																	console.log('删除成功');
																	window.location.reload();
																}
															},
															"json");
												});
									} else  if (obj.event === 'detailstrack') {
											var index = layer.open({
												title : '查看跟踪学生 '+data.stuname+' 的详情',
												type : 2,
												shade : 0.2,
												maxmin : true,
												shadeClose : true,
												area : [ '900px', '450px' ], //页面的宽高
												content : 'Track_details.html',
												success : function(layero, index) {
													var body = layer.getChildFrame('body',index);
													layui.form.render();
													var iframe = layero.find('iframe')[0].contentWindow;
													body.contents().find("#trackid").val(obj.data.trackid);
													body.contents().find("#username").val(obj.data.username);
													body.contents().find("#stuname").val(obj.data.stuname);
													body.contents().find("#trackdatebegin").val(layui.util.toDateString(obj.data.trackdatebegin, 'yyyy-MM-dd HH:mm:ss'));
													body.contents().find("#trackdateend").val(layui.util.toDateString(obj.data.trackdateend, 'yyyy-MM-dd HH:mm:ss'));
													body.contents().find("#tracktype").val(obj.data.tracktype);
													body.contents().find("#trackstate").val(obj.data.trackstate);
													body.contents().find("#trackcontent").val(obj.data.trackcontent);
													body.contents().find("#IsReturnVisit").val(obj.data.IsReturnVisit);
													iframe.layui.form.render('select');
												},
												end : function() {
												}
											});
							                $(window).on("resize", function () {
							                    layer.full(index);
							                });
							            } 
								});

						

						//监听行单击事件（双击事件为：rowDouble）
						table.on('rowDouble(test)', function(obj) {
							var data = obj.data;
							var index = layer.open({
									title: "跟踪 "+ data.stuname+" 学生详情页面",
									type: 2,
									shade: 0.2,
									maxmin: true,
									shadeClose: true,
									area : [ '900px', '450px' ], //页面的宽高
									content: 'Track_details.html',
									success: function(layero, index) {
										console.log(obj.data);
										var body = layer.getChildFrame('body', index);
										layui.form.render();
										var iframe = layero.find('iframe')[0].contentWindow;
										
								
										body.contents().find("#trackid").val(obj.data.trackid);/* title */
										body.contents().find("#username").val(obj.data.username);
										body.contents().find("#stuname").val(obj.data.stuname);
										body.contents().find("#trackdatebegin").val(layui.util.toDateString(obj.data.trackdatebegin, 'yyyy-MM-dd HH:mm:ss'));
										body.contents().find("#trackdateend").val(layui.util.toDateString(obj.data.trackdateend, 'yyyy-MM-dd HH:mm:ss'));
										body.contents().find("#tracktype").val(obj.data.tracktype);
										body.contents().find("#trackstate").val(obj.data.trackstate);
										body.contents().find("#trackcontent").val(obj.data.trackcontent);
										body.contents().find("#IsReturnVisit").val(obj.data.IsReturnVisit);
										iframe.layui.form.render('select');
									},
									end: function() {
									}
								});

							//标注选中样式
							obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
						});
						
						
						
						
						
						
						
						layui.use('laydate', function() {
							var laydate = layui.laydate;
							//同时绑定多个时间选择器
							laydate.render({
								elem: '#trackdatebegin',
								type: 'datetime'
							});
							laydate.render({
								elem: '#trackdateend',
								type: 'datetime'
							});
						});


					});
		</script>

	</body>
</html>
